﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="CategoryKPIPage.aspx.cs" Inherits="FBKPI.Pages.CategoryKPIPage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript">
    $(document).ready(function () {
        mainmenu("#nav ul", "#nav li");
        mainmenu("#menu_wrap ul", "#menu_wrap li");
        $("#divdetail").hide();
        $("#divdetail").dialog({ title: '<span class="header-text">Category KPI Form</span>', autoOpen: false, width: 450, height: 400, modal: true, resizable: false });


        //datatable section
        $("#CategoryKPITable").dataTable({
            "oLanguage": {
                "sZeroRecords": "No records to display",
                "sSearch": "Search"
            },
            "bSort": true,
            "bPaginate": true,
            "bAutoWidth": false,
            "bProcessing": true,
            "bServerSide": true,
            "bDestroy": true,
            "bJQueryUI": true,
            "sPaginationType": "full_numbers",
            "bDeferRender": true,
            "fnServerData": function (sSource, aoData, fnCallback) {
                $.ajax({
                    "dataType": 'json',
                    "type": "GET",
                    "url": "../Serializer/CategoryKPISerializer.ashx",
                    "data": aoData,
                    "success": fnCallback
                });
            },
            "aoColumns": [
             { "mData": "ID" },
                { "mData": "No" },
                { "mData": "Description" },
                { "mData": "isActive" },
                { "mData": "GroupKPI" },
                { "mData": "LastModifiedDate" },
                { "mData": "LastModifiedBy" },
                { "mData": "CreateDate" },
                { "mData": "CreateBy" },
               
            ],
            "aoColumnDefs":
            [
                { "fnRender":
                    function (oObj) {
                        return "<a href=\"#\" onclick=\"OnDetail('" + oObj.aData["ID"] + "')\"><img src='../images/detail.png' /></a>";
                    },
                    "aTargets": [0]
                },
                { "fnRender":
                    function (oObj) {
                        if (oObj.aData["isActive"] == 'True') {
                            return "<img src='../images/check.png' />"
                        }
                        else {
                            return "<img src='../images/cross.png' />"
                        }
                    },
                    "aTargets": [2]
                },
                { "sClass": "center", "aTargets": [0, 2, 4, 5, 6, 7, 8] }
            ]
        });

        //mark selected row
        $('body').on("click", '#CategoryKPITable tbody tr', function () {
            $('#CategoryKPITable tbody tr').removeClass("row_selected");
            $(this).addClass("row_selected");
        });
        //--------------------end of mark selected row-----------------------------
        $("#CategoryKPITable_filter label").after('&nbsp;<button id=\"btnAddNew\" style="right: 0px;" onclick=\'OnDetail(0);return false;\'>New Record</button>');
        //--------------------end of datatable section-----------------------------------------


        OnDetail = function (code) {
            LoadForm('CategoryKPIForm.aspx?ID=' + code, function (result) {
                $("#divdetail").html(result);
                $("#divdetail").dialog('open');
            });
            return false;
        }
    });
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div style="height:525px;overflow:auto;" >
    <div id="categorykpitable">
        <div>
           <div class="customPageHeader">
                <span class="customPageTitle">Category KPI</span>
            </div>
            <div class="ui-widget-content">
                <table cellpadding="0" cellspacing="0" class="display" id="CategoryKPITable">
                    <thead>
                        <tr>
                         <th>
                            </th>
                            <th>
                                No
                            </th>
                            <th>
                                Category KPI
                            </th>
                            <th>
                                is Active
                            </th>
                            <th>
                                Group KPI
                            </th>
                            <th>
                                Last Modified Date
                            </th>
                            <th>
                                Last Modified By
                            </th>
                            <th>
                                Create Date
                            </th>
                            <th>
                                Create By
                            </th>
                           
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>       
            </div>
        </div>
        <br />
    </div>
    <div id="divdetail"></div>   
    </div> 
</asp:Content>
